<template>
	<div style="color: gray;text-align: left;">
		首页/证明审批
	</div>
    <el-row class="row1">
	<el-col :span="5" style="margin-left: 600px;">
	<el-input v-model="inputName" placeholder="请输入学生姓名" @input="usernameInput"></el-input>
	</el-col>
	<el-col :span="4">
		<el-select @change="selectChanged" v-model="classId" placeholder="请选择班级">
			<el-option
			v-for="item in options"
			:key="item.id"
			:label="item.name"
			:value="item.id"></el-option>
		</el-select>
	</el-col>
	
	</el-row>
  <el-table
  class="table"
    :data="tableDataNew"
    stripe
    style="width: 100%;margin-top: 25px;"
	>
	
    <el-table-column
      prop="name"
      label="姓名"
      width="70">
    </el-table-column>
	
    <el-table-column
      prop="user_code"
      label="学号">
    </el-table-column>
	
	<el-table-column
	 prop="class_name"
	 label="班级">
	</el-table-column>
	
	 <el-table-column
	  prop="study"
	  label="学业成绩">
	   
	 </el-table-column>
	 
	<el-table-column
	  prop="academic"
	  label="科研竞赛">
	   
	</el-table-column>
	
	<el-table-column
	  prop="general"
	  label="综合素质">
	   
	</el-table-column>
	
	
  </el-table>
  
  
  
 
</template>

<script>
// import { kebabCase } from 'element-plus/es/utils'
	import axios from "axios"
  export default {

    data() {
      return {
		tableData:[],
		tableDataNew:[],
		inputName:'',
		options:[],
		classId:0
      }
    },
	mounted() {
		function Person(name,user_code,class_name,study,academic,general,class_id){
		              this.name = name;
		              this.user_code = user_code;
					  this.class_name = class_name;
					  this.study = study;
					  this.academic = academic;
					  this.general = general;
					  this.class_id = class_id;
		          }
		function Class(id,name){
			this.id=id;
			this.name = name;
		}
		const that=this
		const url = this.$API_URL+'/teacher/getAllStatus';
		axios.get(url, {
		  params: {
		    manage_id: 1
		  }
		}, {
		  headers: {
		    'Content-Type': 'application/json'
		  }
		})
		.then(response => {
		  console.log(response.data);
		  var temp=response.data;
		  for(var t of temp){
			var p=new Person(t.name,t.user_code,t.class_name,"等待审批","等待审批","等待审批",t.class_id)
			if(t.apply_status=="p"){
				if(t.type=='study') p.study="审批通过";
				else if(t.type == 'academic') p.academic="审批通过";
				else if(t.type == 'general') p.general="审批通过";
			}
			else if(t.apply_status=="f"){
				if(t.type=='study') p.study="审批不通过";
				else if(t.type == 'academic') p.academic="审批不通过";
				else if(t.type == 'general') p.general="审批不通过";
			}
			that.tableData.push(p);
			that.tableDataNew.push(p);
		  }
		console.log(that.tableData);
		})
		
			const url2 = this.$API_URL+'/teacher/getAllClass';
			axios.get(url2, {
			  params: {
			    teacher_id: 1
			  }
			}, {
			  headers: {
			    'Content-Type': 'application/json'
			  }
			})
			.then(response => {
				var temp=response.data;
				for(var t of temp){
					var c=new Class(t.class_id,t.class_name)
					that.options.push(c);
				}
				var c0=new Class(0,"全部")
				that.options.push(c0);
				console.log(that.options)
			})
		},
 methods:{
	selectChanged(value){
		console.log(value)
		if(value==0) this.tableDataNew=this.tableData;
		else this.tableDataNew = this.tableData.filter(item => item.class_id==value)
	},
  
	usernameInput(value){
		 console.log(value)
		 if(value=='') this.tableDataNew=this.tableData;
		 else this.tableDataNew = this.tableData.filter(item =>{
			 if(item.name.includes(value)){
				 return item
			 }
		 })
	 },




 },
 watch:{
  },
  }
</script>


	





